import QtQuick 2.0

Rectangle {
    id: tweet

    signal textChanged
    property string speechText
    property string language: "en"
    property int textSize: 14
    property string textFont: "Verdana"
    property color textColor: "#FF000000"
    
    width: 300
    height: 387
    color: "#FFFFFFFF"
    border.color: "#FF000000"
    border.width: 2
    
    function getNewTweet() {
        var docT = new XMLHttpRequest();
        docT.onreadystatechange = function() {
            if (docT.readyState == XMLHttpRequest.DONE) {
                var jsonObject = eval('(' + docT.responseText + ')');
                if((jsonObject.results[0].text) != tweet1.text) {
                    tweet5pic.source = tweet4pic.source;
                    tweet5.text = tweet4.text;
                    tweet4pic.source = tweet3pic.source;
                    tweet4.text = tweet3.text;
                    tweet3pic.source = tweet2pic.source;
                    tweet3.text = tweet2.text;
                    tweet2pic.source = tweet1pic.source;
                    tweet2.text = tweet1.text;
                    tweet1pic.source = jsonObject.results[0].profile_image_url;
                    tweet1.text = jsonObject.results[0].text;
                }
            }
        }
        docT.open("GET", "http://search.twitter.com/search.json?q=%23"+tweet.speechText+"&lang="+tweet.language+"&rpp=1&include_entities=true&result_type=recent");
        docT.send();
    }
    
    Column {
        anchors.top: parent.top
        anchors.topMargin: 5
        anchors.left: parent.left
        anchors.leftMargin: 5
        spacing: 0
        Rectangle{
            width: tweet.width - 10
            height: 40
            color: "#FF444444"
            Text {
                id: title;
                anchors.verticalCenter: parent.verticalCenter
                anchors.left: parent.left
                anchors.leftMargin: 5
                font.family: tweet.textFont
                font.pointSize: tweet.textSize+6
                text: "#" + tweet.speechText
                color: "#FFFFFFFF"
                onTextChanged: {
                    if(tweet.speechText != ""){
                        tweet1pic.source = "";
                        tweet1.text = "";
                        tweet2pic.source = "";
                        tweet2.text = "";
                        tweet3pic.source = "";
                        tweet3.text = "";
                        tweet4pic.source = "";
                        tweet4.text = "";
                        tweet5pic.source = "";
                        tweet5.text = "";
                        tweet.getNewTweet();
                    }
                }
            }
            MouseArea {
                anchors.fill: parent
                onClicked: {
                    startSpeechRecognition("twitter", false, tweet, tweet.border, tweet.border.color, 2000);
                    tweet.border.color = "red";
                }
            }
        }
        Flickable {
            width: tweet.width - 4
            height: tweet.height - 50
            contentWidth: tweet.width - 4
            contentHeight: allTweets.height + 10
            clip: true
            Column {
                id: allTweets
                anchors.top: parent.top
                anchors.topMargin: 4
                anchors.left: parent.left
                anchors.leftMargin: 0
                spacing: 10
                Row {
                    spacing: 5
                    Image {
                        id: tweet1pic
                    }
                    Text {
                        id: tweet1
                        text: ""
                        font.family: tweet.textFont
                        font.pointSize: tweet.textSize
                        width: tweet.width - 64
                        wrapMode: Text.WordWrap
                        color: tweet.textColor
                    }
                }
                Row {
                    spacing: 5
                    Image {
                        id: tweet2pic
                    }
                    Text {
                        id: tweet2
                        text: ""
                        font.family: tweet.textFont
                        font.pointSize: tweet.textSize
                        width: tweet.width - 64
                        wrapMode: Text.WordWrap
                        color: tweet.textColor
                    }
                }
                Row {
                    spacing: 5
                    Image {
                        id: tweet3pic
                    }
                    Text {
                        id: tweet3
                        text: ""
                        font.family: tweet.textFont
                        font.pointSize: tweet.textSize
                        width: tweet.width - 64
                        wrapMode: Text.WordWrap
                        color: tweet.textColor
                    }
                }
                Row {
                    spacing: 5
                    Image {
                        id: tweet4pic
                    }
                    Text {
                        id: tweet4
                        text: ""
                        font.family: tweet.textFont
                        font.pointSize: tweet.textSize
                        width: tweet.width - 64
                        wrapMode: Text.WordWrap
                        color: tweet.textColor
                    }
                }
                Row {
                    spacing: 5
                    Image {
                        id: tweet5pic
                    }
                    Text {
                        id: tweet5
                        text: ""
                        font.family: tweet.textFont
                        font.pointSize: tweet.textSize
                        width: tweet.width - 64
                        wrapMode: Text.WordWrap
                        color: tweet.textColor
                    }
                }
            }
        }
    }

    Component.onCompleted: {
        title.textChanged.connect(textChanged);
    }
}
